@extends('layouts.mainlayout')

@section('main')
<section class="content">     
    <div class="panel panel-default">
        <div class="panel-heading">Thông Tin Cá Nhân</div>
        <div class='panel-body'>
            <form class="form-horizontal" action="<?php echo asset('user/infouser'); ?>" method="POST" role="form" name="edit_info" id="edit_info">
                <fieldset>
                    <div class="form-group">
                    <div class="form-group">
                        <div class="col-lg-12 avatar" style="text-align:center">

                            <img src="<?php echo Auth::user()->anh_dai_dien; ?>" alt="Ảnh đại diện" title="Ảnh đại diện" width="128px" height="128px" style="padding:3px; border: 1px solid #DDD; box-shadow: 2px 2px 2px #DDD;" class="anh_dai_dien" id="anh_dai_dien">
                            <div class="btn btn-primary edit-avatar" onclick="BrowseServer();" title="Chọn ảnh đại diện" style="position: absolute;z-index: 5;display: none;bottom: 47px;left: 50%;margin-left: -18px;"><i class="fa fa-edit"></i></div>
                        </div>
                    </div>
                        {{ Form::label('username', 'Tài Khoản:',array('class'=>'col-lg-3 control-label')) }}
                        <div class="col-lg-6">
                            {{ Form::text('username',$tai_khoan->username,array('class'=>'form-control ','disabled')) }}
                        </div>
                    </div>

                    <div class="form-group">
                        {{ Form::label('fullname', 'Họ tên',array('class'=>'col-lg-3 control-label')) }}
                        <div class="col-lg-6">
                            {{ Form::text('fullname',$tai_khoan->fullname,array('class'=>'form-control ')) }}
                        </div>
                    </div>

                    <div class="form-group">
                        {{ Form::label('birthday', 'Ngày Sinh:',array('class'=>'col-lg-3 control-label')) }}
                        <div class="col-lg-6">
                            {{ Form::text('birthday',$tai_khoan->birthday,array('class'=>'form-control','id'=>'ngay_sinh')) }}
                        </div>
                        <div class="col-lg-3" id='check-birthday'>
                            
                        </div>
                    </div>

                    <div class="form-group">
                        {{ Form::label('gender', 'Giới Tính:',array('class'=>'col-lg-3 control-label'))}}
                        <div class="col-lg-6"> 
                            <select name="gender" id="gender" class="form-control" required="required">
                                <option value="" <?php if($tai_khoan->gender=="") echo 'selected';?>>Chọn</option>
                                <option value="Nam" <?php if($tai_khoan->gender=="Nam") echo 'selected';?>>Nam</option>
                                <option value="Nữ" <?php if($tai_khoan->gender=="Nữ") echo 'selected';?>>Nữ</option>
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        {{ Form::label('email', 'Email:',array('class'=>'col-lg-3 control-label')) }}
                        <div class="col-lg-6">
                            {{ Form::text('email',$tai_khoan->email,array('class'=>'form-control ')) }}
                        </div>
                        <div class="col-lg-3" id='check-email'>
                            
                        </div>
                    </div>

                    <div class="form-group">
                        {{ Form::label('phone', 'Số Điện Thoại:',array('class'=>'col-lg-3 control-label')) }}
                        <div class="col-lg-6">
                            {{ Form::text('phone',$tai_khoan->phone,array('class'=>'form-control ')) }}
                        </div>
                    </div>

                    <div class="form-group">
                        {{ Form::label('address', 'Địa Chỉ:',array('class'=>'col-lg-3 control-label')) }}
                        <div class="col-lg-6">
                            {{ Form::text('address',$tai_khoan->address,array('class'=>'form-control ')) }}
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-lg-3 control-label">
                            <label>Trạng thái</label>
                        </div>
                        <div class="col-lg-6">
                            @if($tai_khoan->active == 1)
                                <span class="label label-success">Đã kích hoạt </i></span>
                            @else
                                <span class="label label-danger">Chưa kích hoạt (Vui lòng liên hệ bộ phận đào tạo để kích hoạt)</i></span>
                            @endif
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-lg-3"></div>
                        <div class="col-lg-6">
                            <button type="submit" class="btn btn-primary">Cập Nhật</button>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-lg-12" id="noti"></div>
                    </div>
                </fieldset>
            </form>
        </div>
    </div>
</section><!-- /.content -->
<script src="<?php echo asset('public/plugins/ckfinder/ckfinder.js'); ?>"></script>
<script src="<?php echo asset('public/plugins/ckeditor/adapters/jquery.js'); ?>"></script>
<script type="text/javascript">
    var int_email = 0;
    var int_ngaysinh = 0;

    $('#email').keyup(function(event) {
        /* Act on the event */
        var VAL = $(this).val().toString();

        var email = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i);

        if(email.test(VAL)){
            $('#check-email').html('<span class="label label-success">E-mail hợp lệ</i></span>');
            int_email =0;
        }else{
            $('#check-email').html('<span class="label label-danger">E-mail không hợp lệ</i></span>');
            int_email = 1;
        }
    });
    $('#ngay_sinh').keyup(function(event) {
        /* Act on the event */
        var val = $(this).val();
        var date = new RegExp(/^(0[1-9]|[12][0-9]|3[01])[- /.](0[1-9]|1[012])[- /.](19|20)\d\d$/);

        if(date.test(val)){
            $('#check-birthday').html('<span class="label label-success">Ngày sinh hợp lệ</i></span>');
            int_ngaysinh = 0;
        }else{
            $('#check-birthday').html('<span class="label label-danger">Ngày sinh không hợp lệ</i></span>');
            int_ngaysinh =1;
        }
    });
    $('#edit_info').submit(function(event) {
        $("#edit_info input").prop("disabled", true);
        $("#edit_info select").prop("disabled", true);
        $('#noti').html('<br/><div class="alert alert-warning fade in"><p>Đang cập nhật tài khoản</p></div>');
        if(int_ngaysinh == 0 && int_email == 0){
            var fullname= $('#fullname').val();
            var email= $('#email').val();
            var birthday= $('#ngay_sinh').val();
            var phone= $('#phone').val();
            var gender = $('#gender').val();
            var address = $('#address').val();
            $.ajax({
                url: '<?php echo asset("user/infouser")?>',
                type: 'post',
                dataType: 'json',
                data: {
                    fullname: fullname,
                    email: email,
                    birthday: birthday,
                    phone: phone,
                    gender: gender,
                    address: address
                },
            })
            .done(function(data) {
                if(data == 1){
                    $('#noti').html('<br/><div class="alert alert-info fade in"><p>Cập nhật tài khoản thành công.</p></div>');
                    window.location.replace('<?php echo asset("/")?>');
                }
            })
            .fail(function() {
                $("#edit_info input").prop("disabled", false);
                $("#edit_info select").prop("disabled", false);
                $('#noti').html('<br/><div class="alert alert-warning fade in"><p>Thất bại. Vui lòng kiểm tra lại thông tin hoặc tải lại trang</p></div>');
            })
            .always(function() {
                console.log("complete");
            });
        }
        return false;
    });
    function BrowseServer()
    {
        CKFinder.popup( { basePath : '<?php echo asset("public/plugins/ckfinder/"); ?>', selectActionFunction : SetFileField } ) ;
    }
    function SetFileField( fileUrl )
    {
        $.ajax({
            url: '<?php echo asset("ajax/updateavatar")?>',
            type: 'post',
            dataType: 'html',
            data: {img_new_url :fileUrl },
        })
        .done(function(data) {
            $('.anh_dai_dien').attr("src", data);
            console.log(data);
            console.log("success");
        })
        .fail(function() {
            console.log("error");
        })
        .always(function() {
            console.log("complete");
        });
    }

    $('.avatar').hover(function() {
        $('.edit-avatar').show();
    }, function() {
        $('.edit-avatar').hide();
    });
</script>


@stop